<template>
    <div>
        <Table ref="table"
            border
            stripe
            :height="tableHeight"
            :loading="data.isLoading"
            :columns="columns" 
            :data="data.data"
            @on-select="clickDelete">
        </Table>
    </div>
</template>

<script>


export default {
    props: ['data'],
    data () {
        return {
            tableHeight: '',
            columns:[
                {
                    title: '序号',
                    type: 'index',
                    width: 60,
                    align: 'center'
                },
                {
                    title: '筛选',
                    type: 'selection',
                    // width: 100,
                    align: 'center',
                },
                {
                    title: '楼座',
                    key: 'lou',
                    // width: 100,
                    align: 'center'                                    
                },
                {
                    title: '房间号',
                    key: 'num',
                    // width: 100,
                    align: 'center',
                },
                {
                    title: '朝向',
                    key: 'chao',
                    // width: 150,
                    align: 'center',
                },
                {
                    title: '面积',
                    key: 'mian',
                    // width: 100,
                    align: 'center',
                },
                {
                    title: '报价',
                    key: 'bao',
                    // width: 100,
                    align: 'center',
                },
                {
                    title: '操作',
                    key: 'action',
                    // width: 100,                    
                    align: 'center',
                    render: (h, params) => {
                        let edit = h('Button', {
                            attrs: {
                                type: 'warning'
                            },
                            style: {
                                marginRight: '5px'
                            },
                            on: {
                                click: ()=> {
                                    this.$emit('on-action', 'edit', params.row)
                                }
                            }
                        }, '修改')
                        let del = h('Button', {
                            attrs: {
                                type: 'error'
                            },
                            style: {
                                marginRight: '5px'
                            },
                            on: {
                                click: ()=> {
                                    this.$emit('on-action', 'del', params.row)
                                }
                            }
                        }, '删除')
                        return h('div', [edit, del])
                    }
                },
            ]
        }
    },
    methods: {
        clickDelete(selection){
            // console.log(selection);
        }
    },
    updated() {
        // 设置表格高度
        let dataH = document.getElementsByTagName('tbody')[0].offsetHeight;
        dataH = dataH == 0 ? 40 : dataH;
        let tbheight = dataH + document.getElementsByClassName('ivu-table-header')[0].clientHeight + 1;
        let height = window.innerHeight - this.$refs.table.$el.offsetTop - 160 - 5;
        this.tableHeight = tbheight > height ? height : tbheight;
    },
};
</script>

<style lang="less" scoped>

</style>
